<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<html>
<head>

  <link href="apple-touch-icon.png" rel="apple-touch-icon">
  <link href="../favicon.png" rel="icon">

  <title>Product Detail</title>
  <!-- Fonts-->
  <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/font-awesome/css/font-awesome.min.css">
  <!-- CSS Library-->
  <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/bootstrap/dist/css/bootstrap.min.css">
  <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/owl-carousel/assets/owl.carousel.css">
  <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/jquery-bar-rating/dist/themes/fontawesome-stars.css">

  <link href="../css/public.css" type="text/css" rel="stylesheet"/>
  <link rel="stylesheet" type="text/css" href="../css/base.css"/>
  <script type="text/javascript" src="../js/jquery_cart.js"></script>
  <link rel="stylesheet" type="text/css" href="../css/checkOut.css" />


    <link rel="stylesheet" href="/css/shop.css">



    <link href="../css/public.css" type="text/css" rel="stylesheet"/>
  <link rel="stylesheet" type="text/css" href="../css/base.css"/>
  <script type="text/javascript" src="../js/jquery_cart.js"></script>
  <link rel="stylesheet" type="text/css" href="../css/buyConfirm.css" />
  <script src="../js/jquery-1.11.1.min.js" type="text/javascript"></script>
  <script src="../js/unslider.min.js" type="text/javascript"></script>
  <script src="../js/index.js" type="text/javascript"></script>
  <script type="text/javascript">

    window.onload = function(){
      new tab('test4-input-input_tab1-input_tab2', '-');
    }
    function tab(o, s, cb, ev){ //tab换类
      var $ = function(o){return document.getElementById(o)};
      var css = o.split((s||'_'));
      if(css.length!=4)return;
      this.event = ev || 'onclick';
      o = $(o);
      if(o){
        this.ITEM = [];
        o.id = css[0];
        var item = o.getElementsByTagName(css[1]);
        var j=1;
        for(var i=0;i<item.length;i++){
          if(item[i].className.indexOf(css[2])>=0 || item[i].className.indexOf(css[3])>=0){
            if(item[i].className == css[2])o['cur'] = item[i];
            item[i].callBack = cb||function(){};
            item[i]['css'] = css;
            item[i]['link'] = o;
            this.ITEM[j] = item[i];
            item[i]['Index'] = j++;
            item[i][this.event] = this.ACTIVE;
          }
        }
        return o;
      }
    }
    tab.prototype = {
      ACTIVE:function(){
        var $ = function(o){return document.getElementById(o)};
        this['link']['cur'].className = this['css'][3];
        this.className = this['css'][2];
        try{
          $(this['link']['id']+'_'+this['link']['cur']['Index']).style.display = 'none';
          $(this['link']['id']+'_'+this['Index']).style.display = 'block';
        }catch(e){}
        this.callBack.call(this);
        this['link']['cur'] = this;
      }
    }
  </script>

  <!-- Custom-->
  <link rel="stylesheet" href="${pageContext.request.contextPath}/css/shop.css">
</head>

<body class="ps-loading">
<style>
  .dropdown {
    position: relative;
  }

  .dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 110px;
    box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.2);
    padding: 8px 12px;
    z-index: 1;
  }

  .dropdown:hover .dropdown-content {
    display: block;
  }
  .order_btn{
    text-decoration:none;
    color:#333;
  }
</style>

<div class="header--sidebar"></div>
<header class="header">
  <div class="header__top">
    <div class="container-fluid">
      <div class="row">
        <div class="col-lg-6 col-md-8 col-sm-6 col-xs-12 ">
          <p>浙江温州  -  电话: 180 - 7211 - 1xxx</p>
        </div>
        <div class="col-lg-6 col-md-4 col-sm-6 col-xs-12 ">
          <div class="dropdown">
            <div class="header__actions">
              <a href=""><span>我的订单</span></a>
              <div class="dropdown-content">
                <a class="order_btn" href=""><p>全部订单</p></a>
                <a class="order_btn" href=""><p>已付款订单</p></a>
                <a class="order_btn" href=""><p>未付款订单</p></a>
                <a class="order_btn" href=""><p>已退货订单</p></a>
              </div>
              <% String name= (String) request.getSession().getAttribute("username");
                if(name!=null){%>
              <a href=""><%=name%></a>
              <%}else{ %>
              <a href="${pageContext.request.contextPath}/loginandregister.jsp">登陆 </a>
              <%} %>
              <a href="${pageContext.request.contextPath}/loginandregister.jsp"> 注册</a>
            </div>
          </div>

        </div>
      </div>
    </div>
  </div>
  <nav class="navigation">
    <div class="container-fluid">
      <div class="navigation__column left">
        <div class="header__logo"><a class="ps-logo" href="${pageContext.request.contextPath}/allproduct.do"><img src="${pageContext.request.contextPath}/images/logo.png" alt=""></a></div>
      </div>
      <div class="navigation__column center">
        <ul class="main-menu menu">
          <li class="menu-item menu-item-has-children dropdown"><a href="../shop/shop.jsp">Home</a>
            <ul class="sub-menu">
              <li class="menu-item"><a href="../shop/shop.jsp">Homepage #1</a></li>
              <li class="menu-item"><a href="#">Homepage #2</a></li>
              <li class="menu-item"><a href="#">Homepage #3</a></li>
            </ul>
          </li>
          <li class="menu-item menu-item-has-children has-mega-menu"><a href="#">Men</a>
            <div class="mega-menu">
              <div class="mega-wrap">
                <div class="mega-column">
                  <ul class="mega-item mega-features">
                    <li><a href="../shop/product-listing.jsp">NEW RELEASES</a></li>
                    <li><a href="../shop/product-listing.jsp">FEATURES SHOES</a></li>
                    <li><a href="../shop/product-listing.jsp">BEST SELLERS</a></li>
                    <li><a href="../shop/product-listing.jsp">NOW TRENDING</a></li>
                    <li><a href="../shop/product-listing.jsp">SUMMER ESSENTIALS</a></li>
                    <li><a href="../shop/product-listing.jsp">MOTHER'S DAY COLLECTION</a></li>
                    <li><a href="../shop/product-listing.jsp">FAN GEAR</a></li>
                  </ul>
                </div>
                <div class="mega-column">
                  <h4 class="mega-heading">Shoes</h4>
                  <ul class="mega-item">
                    <li><a href="../shop/product-listing.jsp">All Shoes</a></li>
                    <li><a href="../shop/product-listing.jsp">Running</a></li>
                    <li><a href="../shop/product-listing.jsp">Training & Gym</a></li>
                    <li><a href="../shop/product-listing.jsp">Basketball</a></li>
                    <li><a href="../shop/product-listing.jsp">Football</a></li>
                    <li><a href="../shop/product-listing.jsp">Soccer</a></li>
                    <li><a href="../shop/product-listing.jsp">Baseball</a></li>
                  </ul>
                </div>
                <div class="mega-column">
                  <h4 class="mega-heading">CLOTHING</h4>
                  <ul class="mega-item">
                    <li><a href="../shop/product-listing.jsp">Compression & Nike Pro</a></li>
                    <li><a href="../shop/product-listing.jsp">Tops & T-Shirts</a></li>
                    <li><a href="../shop/product-listing.jsp">Polos</a></li>
                    <li><a href="../shop/product-listing.jsp">Hoodies & Sweatshirts</a></li>
                    <li><a href="../shop/product-listing.jsp">Jackets & Vests</a></li>
                    <li><a href="../shop/product-listing.jsp">Pants & Tights</a></li>
                    <li><a href="../shop/product-listing.jsp">Shorts</a></li>
                  </ul>
                </div>
                <div class="mega-column">
                  <h4 class="mega-heading">Accessories</h4>
                  <ul class="mega-item">
                    <li><a href="../shop/product-listing.jsp">Compression & Nike Pro</a></li>
                    <li><a href="../shop/product-listing.jsp">Tops & T-Shirts</a></li>
                    <li><a href="../shop/product-listing.jsp">Polos</a></li>
                    <li><a href="../shop/product-listing.jsp">Hoodies & Sweatshirts</a></li>
                    <li><a href="../shop/product-listing.jsp">Jackets & Vests</a></li>
                    <li><a href="../shop/product-listing.jsp">Pants & Tights</a></li>
                    <li><a href="../shop/product-listing.jsp">Shorts</a></li>
                  </ul>
                </div>
                <div class="mega-column">
                  <h4 class="mega-heading">BRAND</h4>
                  <ul class="mega-item">
                    <li><a href="../shop/product-listing.jsp">NIKE</a></li>
                    <li><a href="../shop/product-listing.jsp">Adidas</a></li>
                    <li><a href="../shop/product-listing.jsp">Dior</a></li>
                    <li><a href="../shop/product-listing.jsp">B&G</a></li>
                  </ul>
                </div>
              </div>
            </div>
          </li>
          <li class="menu-item"><a href="#">Women</a></li>
          <li class="menu-item"><a href="#">Kids</a></li>
          <li class="menu-item menu-item-has-children dropdown"><a href="#">News</a>
            <ul class="sub-menu">
              <li class="menu-item menu-item-has-children dropdown"><a href="#">Blog-grid</a>
                <ul class="sub-menu">
                  <li class="menu-item"><a href="#">Blog Grid 1</a></li>
                  <li class="menu-item"><a href="#">Blog Grid 2</a></li>
                </ul>
              </li>
              <li class="menu-item"><a href="#">Blog List</a></li>
            </ul>
          </li>
          <li class="menu-item menu-item-has-children dropdown"><a href="#">Contact</a>
            <ul class="sub-menu">
              <li class="menu-item"><a href="#">Contact Us #1</a></li>
              <li class="menu-item"><a href="#">Contact Us #2</a></li>
            </ul>
          </li>
        </ul>
      </div>
    </div>
  </nav>
</header>
<div class="header-services">
  <div class="ps-services owl-slider" data-owl-auto="true" data-owl-loop="true" data-owl-speed="7000" data-owl-gap="0" data-owl-nav="true" data-owl-dots="false" data-owl-item="1" data-owl-item-xs="1" data-owl-item-sm="1" data-owl-item-md="1" data-owl-item-lg="1" data-owl-duration="1000" data-owl-mousedrag="on">
    <p class="ps-service"><i class="ps-icon-delivery"></i><strong>免费送货</strong>: 满足xxxx元都可免费获得标准送货服务</p>
    <p class="ps-service"><i class="ps-icon-delivery"></i><strong>免费送货</strong>: 满足xxxx元都可免费获得标准送货服务</p>
    <p class="ps-service"><i class="ps-icon-delivery"></i><strong>免费送货</strong>: 满足xxxx元都可免费获得标准送货服务</p>
  </div>
</div>



<div class="banner_red_top">


</div>


<!--订单提交body部分开始-->


<div class="border_top_cart">

  <div class="container payment-con">
    <form  target="_blank" action="/payutils.do" id="pay-form" method="post">
      <div class="order-info">
        <div class="msg">
          <h3>您的订单已提交成功！付款咯～</h3>
          <p></p>

          <p class="post-date">成功付款后，7天发货</p>
        </div>
        <div class="info">
          <p>
            金额：<span class="pay-total">49.00元</span>
          </p>
          <p>
            订单：1150505740045173                    </p>
          <p>
            配送：潘骏杰                                    <span class="line">/</span>
            159****6437                                    <span class="line">/</span>
            江苏,无锡市,北塘区 民丰西苑82号202室                                                                <span class="line">/</span>
            不限送货时间                                    <span class="line">/</span>
            个人电子发票                                                    </p>
        </div>
        <div class="icon-box">
          <i class="iconfont"><img src="../images/yes_ok.png"></i>
        </div>
      </div>

      <div class="xm-plain-box">
        <!-- 选择支付方式 -->
        <div class="box-hd bank-title clearfix">
          <div id="titleWrap" class="title-wrap">
            <h2 class="title">选择支付方式</h2>
            <h2 class="title hide " >你还需要继续支付 <em>49.00</em> 元</h2>
            <span class="tip-tag"></span>
          </div>
        </div>
        <div class="box-bd" id="bankList">
          <div class="payment-bd">
            <form name="ck">
              <dl class="clearfix payment-box" >
                <dt>
                  <strong>支付平台</strong>
                <p>手机等大额支付推荐使用支付宝快捷支付</p>
                </dt>
                <dd>
                  <fieldset id="test4-input-input_tab1-input_tab2" style=" border:none;">
                    <ul class="payment-list clearfix" >
                      <li><input class="input_tab2" name="myradio" id="r2" type="radio" /><label for="r2" ><img src="../images/zfb.png" alt=""/></label></li>
                    </ul>
                    <div >

                      <div  id="test4_2" style="display:none;">

                      </div>
                      <div  id="test4_3" style="display:none;">

                      </div>
                      <div  id="test4_4" style="display:none;">

                      </div>



                    </div>
                  </fieldset>
                </dd>
              </dl>
            </form>
            <input type="hidden" name="osname" value="${oname}"/>

            <input type="hidden" name="allprice" value="${total}"/>
          </div>
        </div>
        <div class="box-ft clearfix">
          <input type="submit" class="btn btn-primary" value="下一步" id="payBtn">
          <a href="#" class="btn btn-lineDakeLight">修改订单</a>
          <span class="tip"></span>
        </div>
      </div>
    </form>
  </div>
  <!-- 支付弹框 -->
  <div class="modal hide to-pay-tip" id="toPayTip">
    <div class="modal-header">
        <span class="close" id="toPayTipClose">
            <i class="iconfont">&#xe617;</i>
        </span>
      <h3>正在支付...</h3>
    </div>
    <div class="modal-body">
      <div class="pay-tip clearfix">
        <div class="fail">
          <h4>如果支付失败...</h4>
          <p>额度问题，推荐<a href="#" id="alipayTrigger">支付宝快捷支付 &gt;</a></p>
          <p>其他问题，查看<a href="#">支付常见问题 &gt;</a></p>
        </div>
        <div class="success">
          <h4>支付成功了</h4>
          <p>立即查看<a href="#" target="_blank">订单详情 &gt;</a></p>
        </div>
      </div>
    </div>
  </div>
  <!-- 余额支付弹框 -->
  <div class="modal hide  balance-pay" id="balancePay">
    <div class="modal-body">
      <h3>账户余额支付：<span class="num"><em id="useCashAccountPayLeft">0.00</em>元</span></h3>
      <p id="checkCodeTip">短信验证码已下发至您的手机<span class="num"></span></p>
      <input type="text" name="verifycode" id="verifycode" class="input" placeholder="请输入验证码"> <span class="send-again" id="sendAgain">重新发送<em></em></span>
      <p><input type="button" value="确认支付" class="btn btn-primary" id="toPay">
        <div class="select-other">
      <p><span id="bankName"></span> <span class="num">49.00元</span></p>

    </div>
    <a href="javascript:;" id="chooseOther">选择其他方式支付&gt;</a>
  </div>

</div>



<script src="../js/base.min.js"></script>

<script type="text/javascript" src="../js/buyConfirm.js"></script>

</div>




<div class="ps-subscribe">
  <div class="ps-container">
    <div class="row">
      <div class="col-lg-3 col-md-12 col-sm-12 col-xs-12 ">
        <h3><i class="fa fa-envelope"></i>Sign up to Newsletter</h3>
      </div>
      <div class="col-lg-5 col-md-7 col-sm-12 col-xs-12 ">
        <form class="ps-subscribe__form" action="do_action" method="post">
          <input class="form-control" type="text" placeholder="">
          <button>Sign up now</button>
        </form>
      </div>
      <div class="col-lg-4 col-md-5 col-sm-12 col-xs-12 ">
        <p>...and receive  <span>$20</span>  coupon for first shopping.</p>
      </div>
    </div>
  </div>
</div>
<div class="ps-footer bg--cover" data-background="${pageContext.request.contextPath}/images/background/parallax.jpg">
  <div class="ps-footer__content">
    <div class="ps-container">
      <div class="row">
        <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 ">
          <aside class="ps-widget--footer ps-widget--info">
            <header><a class="ps-logo" href="../shop/shop.jsp"><img src="${pageContext.request.contextPath}/images/logo-white.png" alt=""></a>
              <h3 class="ps-widget__title">Address Office 1</h3>
            </header>
            <footer>
              <p><strong>浙江温州</strong></p>
              <p>Email: <a href='mailto:53804545@qq.com'>53804545@qq.com</a></p>
              <p>Phone: +323 32434 5334</p>
              <p>Fax: ++323 32434 5333</p>
            </footer>
          </aside>
        </div>
        <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 ">
          <aside class="ps-widget--footer ps-widget--info second">
            <header>
              <h3 class="ps-widget__title">Address Office 2</h3>
            </header>
            <footer>
              <p><strong>PO Box 16122 Collins  Victoria 3000 Australia</strong></p>
              <p>Email: <a href='mailto:53804545@qq.com'>53804545@qq.com</a></p>
              <p>Phone: +323 32434 5334</p>
              <p>Fax: ++323 32434 5333</p>
            </footer>
          </aside>
        </div>
        <div class="col-lg-2 col-md-2 col-sm-4 col-xs-12 ">
          <aside class="ps-widget--footer ps-widget--link">
            <header>
              <h3 class="ps-widget__title">Find Our store</h3>
            </header>
            <footer>
              <ul class="ps-list--link">
                <li><a href="#">Coupon Code</a></li>
                <li><a href="#">SignUp For Email</a></li>
                <li><a href="#">Site Feedback</a></li>
                <li><a href="#">Careers</a></li>
              </ul>
            </footer>
          </aside>
        </div>
        <div class="col-lg-2 col-md-2 col-sm-4 col-xs-12 ">
          <aside class="ps-widget--footer ps-widget--link">
            <header>
              <h3 class="ps-widget__title">Get Help</h3>
            </header>
            <footer>
              <ul class="ps-list--line">
                <li><a href="#">Order Status</a></li>
                <li><a href="#">Shipping and Delivery</a></li>
                <li><a href="#">Returns</a></li>
                <li><a href="#">Payment Options</a></li>
                <li><a href="#">Contact Us</a></li>
              </ul>
            </footer>
          </aside>
        </div>
        <div class="col-lg-2 col-md-2 col-sm-4 col-xs-12 ">
          <aside class="ps-widget--footer ps-widget--link">
            <header>
              <h3 class="ps-widget__title">Products</h3>
            </header>
            <footer>
              <ul class="ps-list--line">
                <li><a href="#">Shoes</a></li>
                <li><a href="#">Clothing</a></li>
                <li><a href="#">Accessries</a></li>
                <li><a href="#">Football Boots</a></li>
              </ul>
            </footer>
          </aside>
        </div>
      </div>
    </div>
  </div>
  <div class="ps-footer__copyright">
    <div class="ps-container">
      <div class="row">
        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 ">
          <p>Copyright &copy; 2018.Company name All rights reserved.<a target="_blank" href="http://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></p>
        </div>
        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 ">
          <ul class="ps-social">
            <li><a href="#"><i class="fa fa-facebook"></i></a></li>
            <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
            <li><a href="#"><i class="fa fa-twitter"></i></a></li>
            <li><a href="#"><i class="fa fa-instagram"></i></a></li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- JS Library-->
<script type="text/javascript" src="../plugins/jquery/dist/jquery.min.js"></script>

<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="../js/unslider.min.js" type="text/javascript"></script>
<script src="../js/index.js" type="text/javascript"></script>


<!-- Custom scripts-->
<script type="text/javascript" src="${pageContext.request.contextPath}/js/shop.js"></script>
</body>
</html>
